import React, { Component } from 'react'

class Resizeable  extends Component {
    state = {
        size:[window.innerWidth,window.innerHeight]
    }

    onResize = () => {
        this.setState({
            size:[window.innerWidth,window.innerHeight]
        })
    }

    componentDidMount(){
        window.addEventListener('resize',this.onResize)
        document.title = this.state.size.join("x");
    }

    componentDidUpdate(){
        document.title = this.state.size.join("x");
    }


    componentWillUnmount(){
        window.removeEventListener('resize',this.onResize)
    }
    render() {
        return (
            <div>
                {this.props.render(this.state.size)}
            </div>
        )
    }
}

export default Resizeable